<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>OFF the Record</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<script type="text/javascript">
	function truth(companyRevicewVerifyId){
		$.ajax({
			type: "post",
			url: "/OffTheRecord/increaseTruth.action",
			data: "companyRevicewVerifyId="+companyRevicewVerifyId,
			dataType:"json",
			
			success:function(data){
				if(data.flag==true) alert("참여 하셨습니다.");
				else $("#t"+companyRevicewVerifyId).html(data.truth);
			}
		});//ajax
	}
	function object(companyRevicewVerifyId){
		$.ajax({
			type: "post",
			url: "/OffTheRecord/increaseObjection.action",
			data: "companyRevicewVerifyId="+companyRevicewVerifyId,
			dataType:"json",
			
			success:function(data){
				if(data.flag==true) alert("참여 하셨습니다.");
				else $("#o"+companyRevicewVerifyId).html(data.objection);
			}
		});//ajax			
	}
	function insertIR(id){
		$.ajax({
			type: "post",
			url: "/OffTheRecord/addInterestReview.action",
			data: "companyReviewId="+id,
			dataType:"json",
			
			success:function(data){
				alert(data.message);
			}
		});//ajax
	}
	function writeMessage(){
		window.open("/OffTheRecord/getMessageType.action?type=1", "","resizable=no,toolbar=no,width=400, height=350");
	}
</script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body>
<c:import url="../common/top.jsp"></c:import>
<div class="container" style="margin: 60px;"></div>

<div class="container">
<div class="row">
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>

<div class="company-info-review col-xs-10 col-sm-10 col-md-10- col-lg-10" style="border: 1px solid lightgray; border-radius: 5px; padding: 5px;">
	
	<!-- company-top-info -->
	<div class="compnay-top-info col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 5px;">
		
		<!-- company-left -->
		<div class="company-left col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
			<div class="media">
				<a class="pull-left" href="http://${company.companyUrl }">
					<img class="media-object" src="/OffTheRecord/company_ci/${company.companyCi }" width="160px">
				</a>
				<div class="media-body">
					<h1 class="media-heading">
						<b>${company.companyName }</b>
					</h1><p><p>
					<c:set var="total_score" value="${company.companyTotalScore}"/>
					<c:set var="total_score_round" value="${ total_score+((total_score%1>0.5)?(1-(total_score%1))%1:-(total_score%1)) }"/>
					<!-- 색깔있는 별 -->
					<c:forEach begin="1" end="${total_score_round}"><span><img alt="" src="/OffTheRecord/img/star1.png"></span></c:forEach>
					<!-- 회색 별 -->
					<c:forEach begin="1" end="${5-total_score_round }"><span><img alt="" src="/OffTheRecord/img/star2.png"></span></c:forEach>
					<font style="font-weight: bold;">${company.companyTotalScore}점</font>
				</div>
			</div>
		</div>
		<!-- End company-left -->
		
		<!-- company-right -->
		<div class="company-info-right col-xs-6 col-sm-6 col-md-6 col-lg-6" style="border: 1px solid lightgray; border-radius: 5px; padding: 10px;">
			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
				<p><strong>산업 : </strong>${company.industryVo.industryName }</p>
				<p><strong>총 매출액 : </strong>${company.companySales }백만원</p>
				<p><strong>평균 연봉 : </strong>${company.companySalary }만원</p>
				<p><strong>주소 : </strong>${company.companyAddress}</p>
				<p><strong>홈페이지 : </strong>${company.companyUrl}</p>
				
			</div>
		</div>
		<!-- End company-right -->
		
	</div>
	<!-- End compnay-top-info -->
	
	<!-- company-score-info -->
		<div class="company-score-info col-lg-12" style="padding: 5px;">
	
		<!-- company-score -->
		<div class="company-score col-xs-4 col-sm-4 col-md-4 col-lg-4" style="border: 1px solid lightgray; border-radius: 5px; padding: 5px;">
			
			<div class="company-score-bar col-5-xs col-5-sm col-5-md col-5-lg" style="padding: 10px;">
				<!--  -->
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">승진 및 기회</p>
				</div>
				<!--  -->
				<!--  -->		
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">	
						<div class="progress" style="height: 16px;">
							<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
								style="width: ${requestScope.scoreChance*20}%;">
			        			<span class="company-score-bar"></span>
			      			</div>
						</div>
				</div>
				<!--  -->
				<!--  -->		
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">복지 및 급여</p>
				</div>
				<!--  -->
				<!--  -->
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">
					<div class="progress" style="height: 16px;">
						<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
							style="width: ${requestScope.scoreWelfare*20}%;">
							<span class="company-score-bar"></span>
						</div>
					</div>
				</div>
				<!--  -->
				<!--  -->		
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">사내 문화</p>
				</div>
				<!--  -->
				<!--  -->	
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">
			    	<div class="progress" style="height: 16px;">
						<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
							style="width: ${requestScope.scoreCulture*20}%;">
						  	<span class="company-score-bar"></span>
					 	</div>
					</div>
				</div>
				<!--  -->
				<!--  -->
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">휴가 자율성</p>
				</div>
				<!--  -->
				<!--  -->
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">
					<div class="progress" style="height: 16px;">
						<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
							style="width: ${requestScope.scoreHoliday*20}%;">
							<span class="company-score-bar"></span>
					 	</div>
					</div>
				</div>
				<!--  -->
				<!--  -->		
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">초과 근무</p>
				</div>
				<!--  -->
				<!--  -->
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">
					<div class="progress" style="height: 16px;">
						<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
							style="width: ${requestScope.scoreOverdue*20}%">
							<span class="company-score-bar"></span>
						</div>
					</div>
				</div>
				<!--  -->
				<!--  -->		
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-4" style="padding: 0px;">
					<p align="right">경영진</p>
				</div>
				<!--  -->
				<!--  -->	
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-8" style="padding-left:10px; padding-right : 15px;">
					<div class="progress" style="height: 16px;">
						<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
							style="width: ${requestScope.scoreExecutive*20}%">
						<span class="company-score-bar"></span>
						</div>
					</div>
				</div>	
				<!--  -->		
			</div><!-- End company-score-bar -->
					
				
			
			
		</div><!-- End company-score -->
		
		<div class="col-lg-2">
		</div>
		
		<!-- company-info -->
		<div class="comapny-info col-xs-6 col-sm-6 col-md-6 col-lg-6" style="border: 1px solid lightgray; border-radius: 5px; padding: 10px; height: 240px;">
			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
				<dl>
					<dt>기업 상세정보</dt>
					<dd>${company.companyInfo}</dd>
				</dl> 
			</div>
		</div><!-- End company-info -->
		
	</div><!-- End company-score-info -->
	
	<!-- ##### -->
	<!-- review-salary tab -->
	<div class="company-review-salary col-xs-12 col-sm-12 col-md-12 col-lg-12"
		style="padding: 5px;">
	
		<div class="bs-review bs-review-tabs" style="padding: 00px;">
			<ul id="myTab" class="nav nav-tabs">
				<li class="active"><a href="#reviews" data-toggle="tab">리뷰</a></li>
				<li><a href="#salary" data-toggle="tab">연봉</a></li>
			</ul>
		
			<div id="myTabContent" class="tab-content">
				<div class="tab-pane fade in active" id="reviews">
				
					<!-- ##### review ##### -->
			<c:if test="${fn:length(crv) == 0}">
			리뷰가 없습니다.
			</c:if>
			<c:if test="${fn:length(crv) != 0}">
			<c:forEach items="${crv }" var="cr">
			
			<div class="user-review col-xs-12 col-sm-12 col-md-12 col-lg-12" 
				style="padding: 5px;">
			
			
			<!-- user -->
			<div class="user-info col-xs-3 col-sm-3 col-md-3 col-xs-3" style="padding: 5px;">
			
			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="border: 1px solid lightgray; padding: 10px;">
				<strong>작성자 : ${cr.key }</strong>&nbsp;
				<c:if test="${fn:length(mv) != 0}">
					<c:forEach items="${mv }" var="m">
						<c:if test="${m.mentorUserId == cr.value[0].companyReviewVerifyVO.companyReviewVO.companyReviewUserId}">
							<button type="button" class="btn btn-lg btn-success btn-xs" disabled="disabled">
							멘토 <span class="glyphicon glyphicon-star"></span>
							</button>
							<br>
							<button class="btn btn-primary btn-xs" onclick="writeMessage()">
							쪽지 보내기 <span class="glyphicon glyphicon-envelope"></span>
							</button>
						</c:if>
					</c:forEach>
						
				</c:if>
			</div>
			<!--  -->	
			<div class="company-score col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
				
				<div class="company-score-bar col-6-xs col-6-sm col-6-md col-6-lg">
					<div align="center">
						<!-- 평점 -->
						<font style="font-weight: bold;">평점</font>
						<c:set var="scoreVO" value="${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo}"/>
						<c:set var="score" value="${ (scoreVO.scoreChance+scoreVO.scoreWelfare+scoreVO.scoreCulture+scoreVO.scoreHoliday+scoreVO.scoreExecutive+scoreVO.scoreOverdue)/6 }"/>
						<c:set var="score_round" value="${ score+((score%1>0.5)?(1-(score%1))%1:-(score%1)) }"/>
						<!-- 색깔있는 별 -->
						<c:forEach begin="1" end="${score_round}"><span><img alt="" src="/OffTheRecord/img/star1.png"></span></c:forEach>
						<!-- 회색 별 -->
						<c:forEach begin="1" end="${5-score_round}"><span><img alt="" src="/OffTheRecord/img/star2.png"></span></c:forEach>	
					</div><p>
					<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">승진 및 기회</font> 
						</div>
						
						<div class="company-score-bar col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<div class="progress">
				        		<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreChance*20}%;">
									<span class="company-score-bar" style="font: black;"></span>
								</div>
							</div>
						</div>
					</div>
					
					<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">복지 및 급여</font> 
						</div>
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<div class="progress">
								<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreWelfare*20}%;">
							        		<span class="company-score-bar"></span>
								</div>
							</div>
						</div>
					</div>
					
					<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">사내 문화</font> 
						</div>
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<div class="progress">
								<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreCulture*20}%;">
							   		<span class="company-score-bar"></span>
							 	</div>
							</div>
						</div>
					</div>
					
					<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">휴가 자율성</font> 
						</div>
						<div class="progress">
						 	<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreHoliday*20}%;">
						   		<span class="company-score-bar"></span>
						 	</div>
						</div>
					</div>
			
					<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">초과 근무</font> 
						</div>
						<div class="progress">
					  		<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreOverdue*20}%">
								<span class="company-score-bar"></span>
					  		</div>
						</div>
					</div>
			    	
			    	<div class="score-in col-lg-12" style="padding: 0px;">
						<div class="company-score-name col-xs-6 col-sm-6 col-md-6 col-lg-6" style="padding: 0px;">
							<font size="3">경영진</font> 
						</div>
						<div class="progress">
			 				<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: ${cr.value[0].companyReviewVerifyVO.companyReviewVO.scoreVo.scoreExecutive*20}%">
								<span class="company-score-bar"></span>
			        		</div>
			      		</div>
					</div>
				</div>
			</div><!-- End company-score -->
			<!--  -->							
			</div><!-- user -->
			
			<!-- review -->
			<div class="review col-xs-9 col-sm-9 col-md-9 col-xs-9" style="padding: 10px;">
			
				<div class="review-btn col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
					<strong>작성일자 : ${cr.value[2].companyReviewVerifyVO.companyReviewVO.companyReviewWriteDate}</strong>
					<button class="btn btn-danger" onclick="insertIR(${cr.value[2].companyReviewVerifyVO.companyReviewVO.companyReviewId})" style="float: right;">관심 리뷰 추가하기</button>
				</div>
			
				<div class="review col-xs-12 col-sm-12 col-md-12 col-lg-12" style="border: 1p solid lightgray; padding: 10px;">
					
					<div class="review-p-c col-xs-3 col-sm-3 col-md-3 col-lg-3" style="padding: 5px;">
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
							<button class="btn btn-primary btn-xs" onclick="alert('로그인 하세요')">진실</button>
						</c:if>
						
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
							<button class="btn btn-primary btn-xs" onclick="truth(${cr.value[2].companyReviewVerifyVO.companyReviewVerifyId})">진실</button>
						</c:if>
					
						<span id="t${cr.value[2].companyReviewVerifyVO.companyReviewVerifyId}" class="badge">${cr.value[2].t}</span> / 
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
							<button class="btn btn-danger btn-xs" onclick="alert('로그인하세요')">거짓</button>
						</c:if>
					
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
							<button class="btn btn-danger btn-xs" onclick="object(${cr.value[2].companyReviewVerifyVO.companyReviewVerifyId})">거짓</button>
						</c:if>
						
						<span id="o${cr.value[2].companyReviewVerifyVO.companyReviewVerifyId}" class="badge">${cr.value[2].o}</span>
						<br>
						<small>버튼을 눌러 참여해주세요</small>
					</div>
					
					<!-- 리뷰 -->
					<div class="review-review col-xs-9 col-sm-9 col-md-9 col-lg-9" style="padding: 5px;">
						<pre><p class="text-success"><strong>리뷰 : </strong></p>${cr.value[2].companyReviewVerifyVO.companyReviewContents}</pre>
					</div>
					
					
				</div>
				
				<div class="review-p col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
					
					<div class="review-p-p-c col-xs-3 col-sm-3 col-md-3 col-lg-3" style="padding: 5px;">
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
							<button class="btn btn-primary btn-xs" onclick="alert('로그인 하세요')">진실</button>
						</c:if>
				
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
							<button class="btn btn-primary btn-xs" onclick="truth(${cr.value[1].companyReviewVerifyVO.companyReviewVerifyId})">진실</button>
						</c:if>
						<span id="t${cr.value[1].companyReviewVerifyVO.companyReviewVerifyId}" class="badge">${cr.value[1].t}</span> /
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
						<button class="btn btn-danger btn-xs" onclick="alert('로그인하세요')">거짓</button>
						</c:if>
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
						<button class="btn btn-danger btn-xs" onclick="object(${cr.value[1].companyReviewVerifyVO.companyReviewVerifyId})">거짓</button>
						</c:if>
						<span id="o${cr.value[1].companyReviewVerifyVO.companyReviewVerifyId}" class="badge">${cr.value[1].o}</span>
						<p><small>버튼을 눌러 참여해주세요</small></p>
					</div>
					
					<!-- 장점 -->
					<div class="col-xs-9 col-sm-9 col-md-9 col-lg-9" style="padding: 5px;">
						<pre><p class="text-primary"><strong>장점 : </strong></p>${cr.value[1].companyReviewVerifyVO.companyReviewContents}</pre>
					</div>
					
					
				</div>
				
				<div class="review-c col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding: 10px;">
					
					<div class="review-p-p-c col-xs-3 col-sm-3 col-md-3 col-lg-3" style="padding: 5px;">
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
						<button class="btn btn-primary btn-xs" onclick="alert('로그인 하세요')">진실</button>
						</c:if>
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
						<button class="btn btn-primary btn-xs" onclick="truth(${cr.value[0].companyReviewVerifyVO.companyReviewVerifyId})">진실</button>
						</c:if>
						<span id="t${cr.value[0].companyReviewVerifyVO.companyReviewVerifyId}"
						class="badge">${cr.value[0].t}</span> /
						<c:if test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
						<button class="btn btn-danger btn-xs" onclick="alert('로그인하세요')">거짓</button>
						</c:if>
						<c:if test="${sessionScope.adminVo != null || sessionScope.userVo != null}">
						<button class="btn btn-danger btn-xs" onclick="object(${cr.value[0].companyReviewVerifyVO.companyReviewVerifyId})">거짓</button>
						</c:if>
						<span id="o${cr.value[0].companyReviewVerifyVO.companyReviewVerifyId}" class="badge">${cr.value[0].o}</span>
						<p><small>버튼을 눌러 참여해주세요</small></p>
					</div>
						
					<!-- 단점 -->
					<div class="col-xs-9 col-sm-9 col-md-9 col-lg-9" style="padding: 5px;">
						<pre><p class="text-danger"><strong>단점 : </strong></p>${cr.value[0].companyReviewVerifyVO.companyReviewContents}</pre>
					</div>
					
					
				</div>
				
			</div><!-- End review -->
			
			<div class="">
			<p> </p>
			<hr>
			</div>
			
			
			</div><!-- user-review -->
			</c:forEach><!-- 리뷰 -->
			
			<!-- 작성자 작성일자 평점 순위 -->
			</c:if>
			</div>
			
			<!-- ##### review ##### -->
				<div class="tab-pane fade" id="salary">
         <c:forEach items="${crv }" var="list" varStatus="i">
         직종 : ${list.value[0].companyReviewVerifyVO.companyReviewVO.professionVo.professionName}, 
         연봉 : ${list.value[0].companyReviewVerifyVO.companyReviewVO.companyReviewSalary}
         <br>
         </c:forEach>   
               </div>  				
			</div>
		</div>
	</div><!-- review-salary tab -->
				<div align="center">
					<c:forEach var="i" begin="1" end="${page }">
						<c:choose>
							<c:when test="${nowPage != i}">
								<a
									href="/OffTheRecord/getCompanyReview.action?pageNo=${i}&&companyId=${company.companyId}">${i}</a>
							</c:when>
							<c:otherwise>
                                       ${i}
                                       </c:otherwise>
						</c:choose>
									&nbsp;
								</c:forEach>
				</div>
			</div><!-- End company-info-review -->

<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
</div><!-- row -->
</div><!-- container -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
</body>
</html>